<template>
<!-- 列表形式 -->
    <div id="shopList_wrap"> 
        <div class="shopList_contents" v-for="(item,index) in shopList" :key="index" @click="shopListDetail(item.goodsid)">
            <div class="shopList_img">
                <img :src="item.src" alt="">
            </div>
            <div class="shopList_detail">
               <div class="shopList_desc">{{item.title}},{{item.desc}}{{item.desc}}{{item.desc}}{{item.desc}}</div>
               <div class="shopList_spans"><span>xxx{{item.keyWorlds}}</span></div>
               <div class="shopList_prices">￥{{item.shop_price}} <span>{{item.rebate}}</span></div>
               <div class="shopList_spans"><span>销量:{{item.sellcount}}</span></div>
               <!-- <div class="shopList_others"> 20条评价 &nbsp;98%好评</div> -->
            </div>
        </div>
    </div>
</template>

<script>
import { Panel } from "vux";

export default {
  components: {
    Panel
  },
  props: ["shopList"],
  methods: {
      shopListDetail(goodsId){
           this.$router.push({
        name: 'goods_detail',
        params: {
          goodsId: goodsId
        }
      })
      
      }
  },
  data() {
    return {
      type: "1"
    };
  },
  computed: {}
};
</script>
<style lang="less">
#shopList_wrap{
    margin: 0px 0.5rem;
}
.shopList_contents{
    display: flex;
    margin-top:0.1rem; 
    border-radius: 5px;
    padding: 6px;
    background: #ffffff
}
.shopList_img{
    width: 110px;
}
.shopList_img img{
    width: 100px;
    height: 100px;
}
.shopList_detail{
    flex: 1
}
.shopList_spans span{
    display: inline-block;
    background: #f4f4f4;
    margin: 1px;
    font-size: 8px;
    color: #666
}
.shopList_prices{
    font-size: 16px;
    color: #ed393d
}
.shopList_prices span{
 display: inline-block;
 padding: 0px 0.5rem;
    background: #ed393d;
    margin: 1px;
    border-radius: 10px;
    font-size: 8px;
    color: #ffffff
}
.shopList_desc{
    font-size: 14px;
     display: -webkit-box;  
  word-break: break-all;  
  text-overflow: ellipsis;  
  -webkit-box-orient: vertical;  
  -webkit-line-clamp: 2;
  overflow: hidden
}
.shopList_others{
    font-size: 10px;
    color: #666
}
</style>
